/* enum */
import ComponentNameEnum from '@model/enum/ComponentNameEnum'
/* vue */
// @ts-ignore
import { ComponentInstance, ComponentRenderProxy, defineComponent } from 'vue'
import { CommonComponentInstance } from '@model/VC'

export type UiSeparatorProps = {
  list: any[]
  index: number
}

export interface UiSeparatorSetupState {
}

export type UiSeparatorInstance = ComponentInstance & UiSeparatorSetupState
export type UiSeparatorVM = ComponentRenderProxy<UiSeparatorProps> & CommonComponentInstance

export default defineComponent<UiSeparatorProps, UiSeparatorSetupState>({
  name: ComponentNameEnum.UiSeparator,
  props: {
    list: {
      type: Array,
      default: () => []
    },
    index: {
      type: Number
    }
  },
  render() {
    if (this.index >= this.list?.length - 1) {
      return <span></span>
    }
    
    return (
      <span class={ComponentNameEnum.UiSeparator}>,</span>
    )
  }
})
